@mixin extjs-resizable {
  .#{$prefix}resizable-handle {
    position: absolute;
    z-index: 100;
    font-size: 1px;
    line-height: 6px;
    overflow: hidden;
    zoom: 1;
    @include opacity(0);
    background-color: #fff;
  }

  // Collapsed Components cannot be resized
  .#{$prefix}collapsed .#{$prefix}resizable-handle {
    display: none;
  }

  .#{$prefix}resizable-handle-east {
    width: 6px;
    height: 100%;

    right: 0;
    top: 0;
  }

  .#{$prefix}resizable-over {
    .#{$prefix}resizable-handle-east {
      cursor: e-resize;
    }
  }

  .#{$prefix}resizable-handle-south {
    width: 100%;
    height: 6px;

    left: 0;
    bottom: 0;
  }

  .#{$prefix}resizable-over {
    .#{$prefix}resizable-handle-south {
      cursor: s-resize;
    }
  }

  .#{$prefix}resizable-handle-west {
    width: 6px;
    height: 100%;

    left: 0;
    top: 0;
  }

  .#{$prefix}resizable-over {
    .#{$prefix}resizable-handle-west {
      cursor: w-resize;
    }
  }

  .#{$prefix}resizable-handle-north {
    width: 100%;
    height: 6px;

    left: 0;
    top: 0;
  }

  .#{$prefix}resizable-over {
    .#{$prefix}resizable-handle-north {
      cursor: n-resize;
    }
  }

  .#{$prefix}resizable-handle-southeast {
    width: 6px;
    height: 6px;

    right: 0;
    bottom: 0;

    z-index: 101;
  }

  .#{$prefix}resizable-over {
    .#{$prefix}resizable-handle-southeast {
      cursor: se-resize;
    }
  }

  .#{$prefix}resizable-handle-northwest {
    width: 6px;
    height: 6px;

    left: 0;
    top: 0;

    z-index: 101;
  }

  .#{$prefix}resizable-over {
    .#{$prefix}resizable-handle-northwest {
      cursor: nw-resize;
    }
  }

  .#{$prefix}resizable-handle-northeast {
    width: 6px;
    height: 6px;

    right: 0;
    top: 0;

    z-index: 101;
  }

  .#{$prefix}resizable-over {
    .#{$prefix}resizable-handle-northeast {
      cursor: ne-resize;
    }
  }

  .#{$prefix}resizable-handle-southwest {
    width: 6px;
    height: 6px;

    left: 0;
    bottom: 0;

    z-index: 101;
  }

  .#{$prefix}resizable-over {
    .#{$prefix}resizable-handle-southwest {
      cursor: sw-resize;
    }
  }

  /*IE rounding error*/
  .#{$prefix}ie {
    .#{$prefix}resizable-handle-east {
      margin-right: -1px; /*IE rounding error*/
    }

    .#{$prefix}resizable-handle-south {
      margin-bottom: -1px;
    }
  }

  .#{$prefix}resizable-over .#{$prefix}resizable-handle, .#{$prefix}resizable-pinned .#{$prefix}resizable-handle {
    @include opacity(1);
  }

  .#{$prefix}window .#{$prefix}window-handle {
    @include opacity(0);
  }

  .#{$prefix}window-collapsed .#{$prefix}window-handle {
    display: none;
  }

  .#{$prefix}resizable-proxy {
    border: 1px dashed #3b5a82;
    position: absolute;
    left: 0;
    top: 0;
    overflow: hidden;
    z-index: 50000;
  }

  .#{$prefix}resizable-overlay {
    position: absolute;
    left: 0;
    top: 0;

    width: 100%;
    height: 100%;

    display: none;

    z-index: 200000;

    background-color: #fff;

    @include opacity(0);
  }

  .#{$prefix}resizable-over,
  .#{$prefix}resizable-pinned {
    .#{$prefix}resizable-handle-east,
    .#{$prefix}resizable-handle-west {
      background-position: left;
      background-image: theme-background-image($theme-name, 'sizer/e-handle.gif');
    }

    .#{$prefix}resizable-handle-south,
    .#{$prefix}resizable-handle-north {
      background-position: top;
      background-image: theme-background-image($theme-name, 'sizer/s-handle.gif');
    }

    .#{$prefix}resizable-handle-southeast {
      background-position: top left;
      background-image: theme-background-image($theme-name, 'sizer/se-handle.gif');
    }

    .#{$prefix}resizable-handle-northwest {
      background-position: bottom right;
      background-image: theme-background-image($theme-name, 'sizer/nw-handle.gif');
    }

    .#{$prefix}resizable-handle-northeast {
      background-position: bottom left;
      background-image: theme-background-image($theme-name, 'sizer/ne-handle.gif');
    }

    .#{$prefix}resizable-handle-southwest {
      background-position: top right;
      background-image: theme-background-image($theme-name, 'sizer/sw-handle.gif');
    }
  }
}